<template>
	<view class="content">
		<view class="uni-list">
			<view class="uni-list-cell uni-list-cell-pd able">
			  <view class="uni-list-cell-db requireL">店铺logo</view>
			  <view class="soltValue">
					<view class="addIcon" @click="chooseImage('dplogo')" v-if="!dplogo">
						<image src="../../static/imgs/certification/rz_sc@2x.png"></image>
					</view>
					<view class="previewImg" v-if="dplogo">
						<image :src="dplogo" @click="previewImage('dplogo')"></image>
						<image class="cls" src="../../static/imgs/certification/close.png" @click="dplogo=''"></image>
					</view>
			  </view>
			</view>
			<view class="uni-list-cell uni-list-cell-pd able">
			  <view class="uni-list-cell-db requireL">品牌名称</view>
			  <view class="soltValue">
			    <input class="value" type="text" v-model="ppmc" placeholder="请填写">
			  </view>
			</view>
			<view class="uni-list-cell uni-list-cell-pd able">
			  <view class="uni-list-cell-db requireL">地址</view>
			  <view class="soltValue">
			    <input class="value" type="text" v-model="locationAddress" placeholder="请填写">
			  </view>
				<view class="rightIcon" @click="chooseLocation">
				  <image src="../../static/imgs/certification/rz_zb@2x.png"></image>
				</view>
			</view>
		  <view class="uni-list-cell uni-list-cell-pd able">
		    <view class="uni-list-cell-db requireL">负责人</view>
		    <view class="soltValue">
		      <input class="value" type="text" v-model="fzr" placeholder="请填写">
		    </view>
		  </view>
		  <view class="uni-list-cell uni-list-cell-pd able">
		    <view class="uni-list-cell-db requireL">手机号码</view>
		    <view class="soltValue">
		      <input class="value" type="text" v-model="sjhm" placeholder="请填写">
		    </view>
		  </view>
			<view class="uni-list-cell uni-list-cell-pd able">
			  <view class="uni-list-cell-db"><text style="margin-right: 5px;visibility: hidden;">*</text>营业执照</view>
			  <view class="soltValue">
					<view class="addIcon" @click="chooseImage('yyzz')" v-if="!yyzz">
						<image src="../../static/imgs/certification/rz_sc@2x.png"></image>
					</view>
					<view class="previewImg" v-if="yyzz">
						<image :src="yyzz" @click="previewImage('yyzz')"></image>
						<image class="cls" src="../../static/imgs/certification/close.png" @click="yyzz=''"></image>
					</view>
			  </view>
			</view>
		</view>
		<button type="default" class="submit-btn">提交</button>
  </view>
</template>

<script>
	var util = require('../../common/util.js');
	var formatLocation = util.formatLocation;
	export default {
		data() {
			return {
				dplogo: '',
				ppmc: '',
				locationAddress: '',
				fzr: '',
				sjhm: '',
				yyzz: '',
				hasLocation: false,
				location: {},
			};
		},
		methods: {
      bindPickerChange: function(e) {
				this.gender = this.picker[e.detail.value];
      },
      bindDateChange: function(e) {
				this.birthday = e.detail.value
			},
      back() {
				uni.navigateBack({
					delta: 1
				});
      },
			chooseLocation: function () {
				uni.chooseLocation({
					success: (res) => {
						this.hasLocation = true,
						this.location = util.formatLocation(res.longitude, res.latitude),
						this.locationAddress = res.address
					}
				})
			},
      chooseImage: async function(attr) {
				uni.chooseImage({
					sourceType: ['拍照或相册'],
					sizeType: ['压缩'],
					count: 1,
					success: (res) => {
						console.log(attr);
            if (attr == 'dplogo') {
							this.dplogo = res.tempFilePaths[0];
						} else {
							this.yyzz =  res.tempFilePaths[0];
						}
					},
					fail: (err) => {
						// #ifdef APP-PLUS
						if (err['code'] && err.code !== 0) {
							this.checkPermission(err.code);
						}
						// #endif
					}
				})
      },
      async checkPermission(code) {
				let type = code ? code - 1 : this.sourceTypeIndex;
				let status = permision.isIOS ? await permision.requestIOS(sourceType[type][0]) :
					await permision.requestAndroid(type === 0 ? 'android.permission.CAMERA' :
						'android.permission.READ_EXTERNAL_STORAGE');

				if (status === null || status === 1) {
					status = 1;
				} else {
					uni.showModal({
						content: "没有开启权限",
						confirmText: "设置",
						success: function(res) {
							if (res.confirm) {
								permision.gotoAppSetting();
							}
						}
					})
				}
				return status;
			},
			previewImage: function(attr) {
				uni.previewImage({
					urls: [this[attr]]
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
.container {
		overflow: hidden;
  }
  .uni-list {
		.uni-list-cell-db {
			width: 100px;
			max-width: 100px;
			min-width: 100px;
		}
		.rightIcon {
			position: absolute;
			right: 10px;
			top: 17px;
			image {
				width: 18px;
				height: 18px;
			}
		}
		.addIcon {
			display: flex;
			image {
				width: 18px;
				height: 18px;
			}
		}
		.soltValue {
			flex-grow: 1;
			input {
				text-align: left;
			}
		}
	}
	.previewImg {
		position: relative;
		width: 100px;
		.cls {
			position: absolute;
			width: 20px;
			height: 20px;
			right: -5px;
			top: -5px;
			z-index: 10;
		}
		image {
			width: 100px;
			height: 100px;
		}
	}
</style>
